{{extend defaultLayout}}

{{block 'css'}}
<link rel="stylesheet" href="{{_res_path}}state/state.css">
{{/block}}
{{block 'main'}}
<div class="box">
    <div class="tb">
        <img src="{{portrait}}" alt="头像" onerror="this.src= '{{_res_path}}img/tb.png'; this.onerror = null;">
        <div class="header">
            <h1>{{nickname}}</h1>
            <hr noshade>
            <p>{{status}}({{platform}}) | 收{{recv}} | 发{{sent}} | 图片{{screenshot}} | 好友{{friend_quantity}} |
                群{{group_quantity}}
            </p>
            <p>Yunzai-Bot 已运行 {{runTime}} | 系统运行 {{systime}}</p>
            <p>{{calendar}} | Nodejs {{nodeversion}} | {{osinfo.platform}}</p>
        </div>
    </div>

</div>
<div class="box">
    <ul class="info">
        {{each visualData group}}
        <li class="li">
            <div class="cpu">
                <div class="left">
                    <div class="left-circle" {{@group.leftCircle}}>
                    </div>
                </div>
                <div class="right">
                    <div class="right-circle" {{@group.rightCircle}}>
                    </div>
                </div>
                <div class="inner">
                    {{group.inner}}
                </div>
            </div>
            <article>
                <summary>{{group.title}}</summary>
                {{each group.info info}}
                <p>{{info}}</p>
                {{/each}}
            </article>
        </li>
        {{/each}}
    </ul>
</div>

{{if HardDisk}}
<div class="box memory">
    <ul>
        {{each HardDisk}}
        <li class="HardDisk_li">
            <div class="word mount">{{$value.mount}}</div>
            <div class="progress">
                <div class="word">{{$value.used}} / {{$value.size}}</div>
                <div class="current" style="width:{{$value.use}}%;background:{{$value.color}}"></div>
            </div>
            <div class="percentage">{{$value.use}}%</div>
        </li>
        {{/each}}
    </ul>
    {{if fsStats}}
    <div class="speed">
        <p>fsStats</p>
        <p>读 {{fsStats.rx_sec}}/s | 写 {{fsStats.wx_sec}}/s</p>
    </div>
    {{/if}}
</div>
{{/if}}

{{@FastFetch}}

<div class="box">
    <div class="speed">
        <p>系统</p>
        <p>{{osinfo.distro}}</p>
    </div>
    {{if network}}
    <div class="speed">
        <p>{{network.iface}}</p>
        <p>↑{{network.tx_sec}}/s | ↓{{network.rx_sec}}/s</p>
    </div>
    {{/if}}
    <div class="speed">
        <p>插件</p>
        <p>{{plugin.plugins}} plugin | {{plugin.js}} js</p>
    </div>
</div>
{{/block}}